.home-main{
    padding: 0px 30px;
    height: 80vh;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.circle{
    z-index: 3;
    background-color: aliceblue;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    animation: fadein 0.8s ease-in ;
}
.home-image-bg{
    background-image: url(../asset/cat.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    transform-origin: bottom left;
    animation: scalein 1s ease-in-out ;
}
.home-wrapper{
    position: absolute;
    height: 150vh;
    width: 100vw;
    background-color: #f3aa81;
    z-index: 2;
    animation: fadeout 0.8s linear forwards;
    animation-delay: 1.5s;
}

@keyframes scalein {
    from{
        transform: scale(0)
    }
    to{
        transform: scale(1)
    }
}
@keyframes fadein {
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
}
@keyframes fadeout {
    from{
        opacity: 1;
    }
    to{
        opacity: 0;
        z-index: -999;
    }
}